<%@ Page Language="c#" MasterPageFile="../masterpages/umbracoDialog.Master"Codebehind="sort.aspx.cs" AutoEventWireup="True" Inherits="umbraco.cms.presentation.sort" %>
<%@ Register TagPrefix="cc1" Namespace="umbraco.uicontrols" Assembly="controls" %>

<asp:Content ContentPlaceHolderID="head" runat="server">

  <script type="text/javascript" src="../js/prototype.js"></script>
  <script type="text/javascript" src="../js/scriptaculous/scriptaculous.js?load=effects,dragdrop"></script>
      
  <style type="text/css">
    #sortableFrame{height: 270px; overflow: auto; border: 1px solid #ccc;}
    #sortableNodes{list-style: none; padding: 5px; display: block; margin-left: 0px:}
    #sortableNodes li{padding: 4px; background: 2px 1px no-repeat; padding-left: 25px; margin: 3px; cursor: move;}
  </style>

</asp:Content>

<asp:Content ContentPlaceHolderID="body" runat="server">

<div id="loading" style="display: none;">
<div class="notice">
      <p><%= umbraco.ui.Text("sort", "sortPleaseWait") %></p>
</div>
<br />
<img src="/umbraco_client/images/progressbar.gif" />
</div>

<div id="sortingDone" style="display: none;" class="success">
  <p><asp:Literal runat="server" ID="sortDone"></asp:Literal></p>
  <p>
  <a href="#" onClick="top.closeModal()"><%= umbraco.ui.Text("defaultdialogs", "closeThisWindow")%></a>
  </p>
</div>

<div id="sortArea">
<cc1:Pane runat="server" ID="sortPane">
  <p class="help">
    <%= umbraco.ui.Text("sort", "sortHelp") %>
  </p>
  <div id="sortableFrame">
    <ul id="sortableNodes">
      <asp:Literal ID="lt_nodes" runat="server" />
    </ul>
  </div>

</cc1:Pane>

  <br />
  <p>
    <input type="button" onclick="sort(); return false;" value='<%=umbraco.ui.Text("save") %>' />
    <em> or </em><a href="#" style="color: blue"  onClick="parent.closeModal()"><%=umbraco.ui.Text("general", "cancel", this.getUser())%></a>  
  </p>
</div>
  
   <script type="text/javascript">
      Position.includeScrollOffsets = true;
      
      Sortable.create("sortableNodes", {
         dropOnEmpty: true,
         constraint:"vertical",
         scroll: "sortableFrame"
       });

       function sort() {
         var sortOrder = Sortable.sequence('sortableNodes').join(',');;
        
        document.getElementById("sortingDone").style.display = 'none';
        document.getElementById("sortArea").style.display = 'none';
        	    
		    document.getElementById("loading").style.display = 'block';	    
		    umbraco.presentation.webservices.nodeSorter.UpdateSortOrder(<%=umbraco.helper.Request("ID")%>, sortOrder, showConfirm);
       }
       
       function showConfirm() {
		    document.getElementById("loading").style.display = 'none';	    
		    document.getElementById("sortingDone").style.display = 'block';	
		    top.reloadCurrentNode();
		}
		  
  </script>
  
</asp:Content>
  